﻿<script src="~/vue/dist/vue.global.js"></script>
<link href="~/element-plus/dist/index.css" rel="stylesheet" />
<script src="~/element-plus/dist/index.full.js"></script>
<script src="~/axios/dist/axios.js"></script>
<div id="app">
    <el-row>
        <el-col :span="24">
            您正在做的业务是：人力资源--权限管理--添加角色
        </el-col>
    </el-row>
    <el-row>
        <el-col :span="24" style="text-align: right">
            <el-button type="primary" v-on:click="Add()">提交</el-button>
            <el-button v-on:click="Fh()">返回</el-button>
        </el-col>
    </el-row>
    <el-row style="height: 10px"></el-row>
    <el-row style="text-indent: 10px">
     
        <el-col :span="6" style="border: 1px solid black; background-color: #ffd553;">
            角色名称
        </el-col>
        <el-col :span="6" style="border: 1px solid black;">
            <el-input v-model="data12.RolesName" size="small" style="width: 250px;" />
        </el-col>
        <el-col :span="6" style="border: 1px solid black; background-color: #ffd553;">
            角色说明
        </el-col>
        <el-col :span="6" style="border: 1px solid black;">
            <el-input v-model="data12.RolesInstruction" size="small" style="width: 250px;" />
        </el-col>
        <el-col :span="6" style="border: 1px solid black; background-color: #ffd553;">
            角色是否可用(是/否)
        </el-col>
        <el-col :span="6" style="border: 1px solid black;">
            <el-select v-model="data12.RolesIf" size="small" style="width: 250px;" placeholder="请选择">
                <el-option label="是" value="true">是</el-option>
                <el-option label="否" value="false">否</el-option>
            </el-select>
        </el-col>
    </el-row>
</div>

<script type="text/javascript">
    const { createApp, ref, reactive } = Vue
    const { ElMessage } = ElementPlus
    var app = createApp({
        setup() {
          
            const index = ref(null)
            const refs = ref();
            const props = reactive({
                label: "label",
                value: "value",
                children: "children",
            })
            const data12 = reactive({
                RolesName: null,
                RolesInstruction: null,
                RolesIf: null,
                
            })
           
            function Add() {
                console.log(data12);
                axios.post("/Roles/RolesAdd", null, {
                    params: data12
                })
                .then(res => {
                    ElMessage({
                    type: 'success',
                    message: '添加成功！'});
                    setInterval(()=>{
                        window.location.href = "/Roles/Index"
                    })
                })
                .catch(err => {
                    console.log(err);
                })
            }
            function handleChange() {
                const a = [];
                const b = [];
                const arr = refs.value.getCheckedNodes()[0].pathNodes;
                arr.forEach((i) => {
                    a.push(i.label);
                    b.push(i.value);
                });
                cftk.FirstKindId = b[0];a
                cftk.FirstKindName = a[0];
                cftk.SecondKindId = b[1];
                cftk.SecondKindName = a[1];
            }
            function Fh() {
                window.history.back()
            }
         
            return {
             
                
                props,
                refs,
              
                index,
                handleChange,
               
                Add,
                Fh,
                data12
            }
        }
    })
    app.use(ElementPlus)
    app.mount('#app')
</script>

<style scoped>
    body {
        background-color: #ffffcc;
    }
</style>